<!DOCTYPE html
	PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>无标题文档</title>
	</head>
	<script src="../js/DateJS.js" type="text/javascript">
	</script>
	<style type="text/css">
		body {
			background-color: #3994EE;
			text-align: center;
		}
		
		.div1 {
			background-image: url(img/1.png);
			width: 118px;
			height: 60px;
			color: #F6F6F6;
			float: left;
		}
		
		.div1:hover {
			background-image: url(img/2.png);
		}
		
		.div1:active {
			background-image: url(img/3.png);
		}
		
		a {
			text-decoration: none;
		}
		
		.div2 {
			height: 1px;
		}
		
		.div3 {
			border: #0CF solid 2px;
			height: 600px;
			margin-top: 65px;
			background-color: #E7FEED;
		}
	</style>

	<body>
		<div id="particularQueryStaff">
			<div class="div2">
				<table width="354" border="0" cellspacing="0" cellpadding="0">
					<tr>
						<td width="118">
							<a href="ygxxcx.html">
								<div class="div1">
									<h4 style="text-align:center; line-height:0"> 员工信息查询</h4>
								</div>
							</a>
						</td>
						<td width="118">
							<a href="ygxxxx.html">
								<div class="div1" style=" background-color:#F90">
									<h4 style="text-align:center; line-height:0">详细信息查询</h4>
								</div>
							</a>
						</td>
						<td width="118">

							<td width="118">

							</td>
					</tr>
				</table>
			</div>
			<div class="div3" align="center">
				<form onsubmit="return false;">
					<table width="880" border="0" cellpadding="0" cellspacing="0">
						<tr>
							<td width="140" rowspan="13" align="center" valign="middle">
								<h1>
									员
									<br />
									工
									<br />
									详
									<br />
									细
									<br />
									信
									<br />
									息
									<br />
									查
									<br />
									询
									<br />
									及
									<br />
									修
									<br />
									改
									<br />
								</h1>
							</td>
							<td width="96" height="30" align="right" valign="middle">
								员工号：
							</td>
							<td width="188" align="left" valign="middle">
								<input type="text" v-model="staffList.id" disabled="disabled">
								<font color="#FF0000">*</font><span id="nomspan"></span>
							</td>
							<td width="113" height="30" align="right" valign="middle">
								姓名：
							</td>
							<td width="193" align="left" valign="middle">
								<input type="text" v-model="staffList.user_name">
								<span id="namespan"></span>
							</td>
							<td width="145">
								<font color="#FF0000" size="-1"></font>
							</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">
								性别：
							</td>
							<td align="left" valign="middle">
								<select name="gender" v-model="staffList.gender">
									<option selected="selected"> 请选择 </option>
									<option value="男"> 男 </option>
									<option value="女"> 女 </option>
								</select>
								<span id="sexspan"></span>
							</td>
							<td height="30" align="right" valign="middle">
								出生日期：
							</td>
							<td align="left" valign="middle">
								<input type="text" style="border: 1px solid #999;" name="birthday" v-model="staffList.birthday" />
								<span id="birthdayspan"></span>
							</td>
							<td>
								&nbsp;
							</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">
								身高：
							</td>
							<td align="left" valign="middle">
								<input type="text" v-model="staffList.height">
							</td>
							<td height="30" align="right" valign="middle">
								身份证号：
							</td>
							<td align="left" valign="middle">
								<input type="text" v-model="staffList.id_card_number">
								<span id="IDspan"></span>
							</td>
							<td>
								&nbsp;
							</td>
						</tr>
						<tr>
							<td width="96" height="30" align="right" valign="middle">
								部门：
							</td>
							<td width="188" align="left" valign="middle">
								<select name="department" v-model="staffList.department">

									<option value="销售部">销售部</option>

									<option value="市场部">市场部</option>

									<option value="创意部">创意部</option>

									<option value="人事部">人事部</option>

									<option value="管理部">管理部</option>

									<option value="部门测试">部门测试</option>

								</select>
								<!-------------------------------------->
								<font color="#FF0000">*</font><span id="deptspan"></span>
							</td>
							<td width="113" height="30" align="right" valign="middle">
								岗位：
							</td>
							<td width="193" align="left" valign="middle">
								<select name="station" v-model="staffList.station">

									<option value="营销推广">营销推广</option>

									<option value="销售代理">销售代理</option>

									<option value="采购材料">采购材料</option>

									<option value="市场调查">市场调查</option>

									<option value="创意总监">创意总监</option>

									<option value="设计员">设计员</option>

									<option value="检测员">检测员</option>

									<option value="人事经理">人事经理</option>

									<option value="后勤员">后勤员</option>

									<option value="总经理">总经理</option>

									<option value="副总经理">副总经理</option>

									<option value="经理助理">经理助理</option>

								</select>
								<font color="#FF0000">*</font><span id="jobspan"></span>
							</td>
							<td>
								&nbsp;
							</td>
						</tr>
						<tr>
							<td width="96" height="30" align="right" valign="middle">
								入职日期：
							</td>
							<td width="188" align="left" valign="middle">
								<input type="date" style="border: 1px solid #999;" v-model="staffList.in_job_time" />
								<span id="hiredatespan"></span>
							</td>
							<td width="113" height="30" align="right" valign="middle">
								参加工作日期：
							</td>
							<td width="193" align="left" valign="middle">
								<input type="date" style="border: 1px solid #999;" v-model="staffList.in_work_time" />
								<span id="joindatespan"></span>
							</td>
							<td>
								&nbsp;
							</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">
								用工形式：
							</td>
							<td align="left" valign="middle">
								<select v-model="staffList.employment_form">
									<option value="正式员工">
										正式员工
									</option>
									<option value="临时员工">
										临时员工
									</option>
								</select>
								<span id="workformspan"></span>
							</td>
							<td height="30" align="right" valign="middle">
								人员来源：
							</td>
							<td align="left" valign="middle">
								<select v-model="staffList.personnel_source">
									<option value="校园招聘">
										校园招聘
									</option>
									<option value="社会招聘">
										社会招聘
									</option>
									<option value="其它">
										其它
									</option>
								</select>
								<span id="sourcespan"></span>
							</td>
							<td>
								&nbsp;
							</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">
								婚姻状况：
							</td>
							<td align="left" valign="middle">
								<select v-model="staffList.marital_status">
									<option value="已婚">
										已婚
									</option>
									<option value="未婚">
										未婚
									</option>
									<option value="丧偶">
										丧偶
									</option>
									<option value="离婚">
										离婚
									</option>
									<option value="保密">
										保密
									</option>
								</select>
							</td>
							<td height="30" align="right" valign="middle">
								政治面貌：
							</td>
							<td align="left" valign="middle">
								<select v-model="staffList.political_outlook">
									<option value="党员">
										党员
									</option>
									<option value="预备党员">
										预备党员
									</option>
									<option value="团员">
										团员
									</option>
									<option value="其他">
										其他
									</option>
								</select>
							</td>
							<td>
								&nbsp;
							</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">
								电子邮件：
							</td>
							<td align="left" valign="middle">
								<input type="text" v-model="staffList.email">
							</td>
							<td height="30" align="right" valign="middle">
								联系电话：
							</td>
							<td align="left" valign="middle">
								<input type="text" v-model="staffList.tel">
								<span id="phonespan"></span>
							</td>
							<td>
								&nbsp;
							</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">民族：</td>
							<td align="left" valign="middle">
								<input type="text" v-model="staffList.nationality" />
							</td>
							<td height="30" align="right" valign="middle">
								籍贯：
							</td>
							<td align="left" valign="middle">
								<input type="text" v-model="staffList.native_place">
							</td>
							<td>
								&nbsp;
							</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">
								出生地：
							</td>
							<td align="left" valign="middle">
								<input type="text" v-model="staffList.birth_place">
							</td>
							<td height="30" align="right" valign="middle">
								血型：
							</td>
							<td align="left" valign="middle">
								<select v-model="staffList.blood_type">
									<option value="A型">
										A型
									</option>
									<option value="B型">
										B型
									</option>
									<option value="AB型">
										AB型
									</option>
									<option value="O型">
										O型
									</option>
									<option value="其他血型">
										其他血型
									</option>
								</select>
								<td>
									&nbsp;
								</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">最高学历：</td>
							<td align="left" valign="middle">
								<select v-model="staffList.education">
									<option value="高中及以下"> 高中及以下</option>
									<option value="大专"> 大专</option>
									<option value="本科"> 本科</option>
									<option value="研究生"> 研究生</option>
								</select>
								<font color="#FF0000">*</font><span id="maxeducationspan"></span>
							</td>
							<td height="30" align="right" valign="middle">
								最高学位：
							</td>
							<td align="left" valign="middle">
								<select v-model="staffList.degrees">
									<option value="无学位"> 无学位 </option>
									<option value="学士"> 学士</option>
									<option value="双学士"> 双学士</option>
									<option value="硕士"> 硕士</option>
									<option value="博士"> 博士 </option>
									<option value="博士后"> 博士后</option>
								</select>
								<span id="maxdegreespan"></span>
							</td>
							<td>
								&nbsp;
							</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">
								毕业院校：
							</td>
							<td align="left" valign="middle">
								<input type="text" v-model="staffList.university">
							</td>
							<td height="30" align="right" valign="middle">
								所学专业：
							</td>
							<td align="left" valign="middle">
								<input type="text" v-model="staffList.major">
							</td>
							<td>
								&nbsp;
							</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">毕业日期：</td>
							<td align="left" valign="middle">
								<input type="date" style="border:1px solid #999;" v-model="staffList.graduation_date" />
							</td>
							<td height="30" align="right" valign="middle">
								&nbsp;
							</td>
							<td align="left" valign="middle">
								&nbsp;
							</td>
							<td>
								&nbsp;
							</td>
						</tr>
					</table>
					<br />
					<table border="0" cellspacing="0" cellpadding="0">
						<!--  <tr>
							<td width="122" rowspan="4">
								&nbsp;
							</td>
							<td width="276" align="center" valign="middle">
								名称
							</td>
							<td width="303" align="center" valign="middle">
								描述
							</td>
							<td width="122" rowspan="4">
								&nbsp;
							</td>
						</tr>
						<tr>
							<td height="30" align="center" valign="middle">
								试用期开始日期：
							</td>
							<td align="center" valign="middle">
								<input type="text" style="border: 1px solid #999;"
									name="startdate" onClick="fPopCalendar(event,this,this)"
									onFocus="this.select()" readonly="readonly" />
								<font color="#FF0000">*</font><span id="startdatespan"></span>
							</td>
						</tr>
						<tr>
							<td height="30" align="center" valign="middle">
								试用期结束日期：
							</td>
							<td align="center" valign="middle">
								<input type="text" style="border: 1px solid #999;"
									name="enddate" onClick="fPopCalendar(event,this,this)"
									onFocus="this.select()" readonly="readonly" />
								<font color="#FF0000">*</font><span id="enddatespan"></span>
							</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="bottom"
								style="padding-right: 10px;">
								
							</td>
							-->
						<td align="left" valign="bottom" style="padding-left: 10px;">
							<input type="number" v-model="staffList.id" placeholder="输入员工号查询" @keyup.enter="getStaff()" />
							<button @click="getStaff()">查询</button>
							<button @click="updateStaff()">修改</button>
							<input style="margin-left: 15px;" type="reset" value="重置" onclick="location.reload()" />
							<br />
							<font style='color: blue' onclick='history.back()'>返回</font>
						</td>
						</tr>
					</table>
					<h3 style="color:red;"></h3>
				</form>
			</div>
		</div>

		<script src="../js/axios.js"></script>
		<script src="../js/vue.js"></script>
		<script>
			axios.defaults.baseURL = "http://176.55.4.113"
			const particularQueryStaff = new Vue({
				el: '#particularQueryStaff',
				data: {
					staffList: {
						"id": ''
					}

				},
				methods: {
					getStaff() {
						axios.get("/staff/particular_query?id=" + this.staffList.id).then(result => {
							if(result.data.data != null) {
								this.staffList = result.data.data
							} else {
								alert("查询失败")
							}
						})
					},
					updateStaff() {
						axios.put("/staff/updateStaff", this.staffList).then(result => {
							console.log(result.data.status)
							if(result.data.status == 200) {
								alert("修改成功")
							} else {
								alert("修改失败")
							}
						})

					}
				}
			})
		</script>
	</body>

</html>